<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>添加用户</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../lib/layui/css/layui.css">
    <link rel="stylesheet" href="../css/scroll-bar.css">
    <link rel="stylesheet" href="../css/sub-page.css">
    <link rel="stylesheet" href="../css/font.css">
</head>

<body>
    <input id='id' class="layui-hide">
    <input id='data' class="layui-hide">


    <div class="layui-form-item layui-hide" id="form-item">
        <div class="layui-inline">
            <label class="layui-form-label">标签值=</label>
            <div class="layui-input-inline">
                <input type="text" name="tag1" lay-verify="required" autocomplete="off" class="layui-input">
            </div>
        </div>

        <label class="layui-form-label">条件</label>
        <div class="layui-input-inline">
            <select name="condition1" lay-verify="required" class="condition">
                <option value="">请选择条件</option>
                <option value="and" selected="">并且</option>
                <option value="or">或者</option>
            </select>
        </div>

        <div class="layui-inline">
            <a class="layui-btn layui-btn-sm action-add"><i class="layui-icon"></i></a>
        </div>
        <div class="layui-inline">
            <a class="layui-btn layui-btn-sm action-del"><i class="layui-icon"></i></a>
        </div>
    </div>

    <form class="layui-form" action="">

        <div id="conditionlist">
            <div class="layui-form-item" id="form-item1">
                <div class="layui-inline">
                    <label class="layui-form-label">标签值=</label>
                    <div class="layui-input-inline">
                        <input type="text" name="tag1" lay-verify="required" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <label class="layui-form-label">条件</label>
                <div class="layui-input-inline">
                    <select name="condition1" lay-verify="required" class="condition">
                        <option value="">请选择条件</option>
                        <option value="and" selected="">并且</option>
                        <option value="or">或者</option>
                    </select>
                </div>

                <div class="layui-inline">
                    <a class="layui-btn layui-btn-sm action-add"><i class="layui-icon"></i></a>
                </div>
                <div class="layui-inline">
                    <a class="layui-btn layui-btn-sm action-del"><i class="layui-icon"></i></a>
                </div>

            </div>
        </div>



        <div class="layui-form-item" id="action">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
        <div class="layui-form-mid layui-word-aux">
            <pre>
                提示：在【数据筛选】模式下，若要进行条件过滤，请按系统保留值来设定。
                筛选合格标签值= ##classify##
                筛选不合格标签值= ##unclassify##
            </pre>
        </div>
    </form>


    <script src="../lib/layui/layui.js"></script>
    <!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
    <script>
        layui.use(['form', 'layedit', 'laydate', 'jquery'], function () {
            var form = layui.form,
                layer = layui.layer,
                $ = layui.jquery;
            var searchitem = [];
            /* $('.condition').val('or');
            form.render('select'); */
            //监听提交
            form.on('submit(demo1)', function (data) {
                /* layer.alert(JSON.stringify(data.field), {
                    title: '最终的提交信息'
                }) */
                callback($('#id').val(), data.field);
                var submit_ids = [];
                const dsid = $('#id').val();
                for (let j = 0; j < searchitem.length; j++) {
                    const item = searchitem[j];
                    if (dsid == item.dsid) { //已选择
                        submit_ids.push(item);
                        break;
                    }
                }

                $.ajax({
                    url: '/dataset/binddataset_showdetail',
                    method: 'post',
                    data: {
                        dsid: $('#id').val(),
                        ids: JSON.stringify(submit_ids),
                        dstype: 0
                    },
                    dataType: 'JSON',
                    success: function (res) {
                        console.log(res);
                        if (res.code == 1) {
                            layer.msg('高级检索数据命中数：' + res.totalcount,{time:2000,icon:1}, function () {
                                window.parent.callback($('#id').val(), data.field);
                                var index = window.parent.layer.getFrameIndex(
                                    window.name);
                                window.parent.layer.close(index);
                            });

                        } else if (res.code == -1) {
                            layer.msg('不能重复添加');
                        } else {
                            layer.msg('操作失败');
                        }
                    },
                    error: function (data) {}
                });

                return false;
            });

            $(document).on("click", ".action-add", function () {
                console.log('action-add');
                var id = Math.floor(Math.random() * 10000 + 1);
                var target = $('#form-item').clone(true);
                target.attr('id', 'form-item' + id).removeClass('layui-hide');
                target.find('.layui-input').attr('name', 'tag' + id).val('');
                target.find('.condition').attr('name', 'condition' + id);
                $('#conditionlist').append(target);
                form.render('select');
            });
            $(document).on("click", ".action-del", function () {
                $(this).parent().parent().remove();
            });
            bind_condition();
            //绑定数据过滤条件            
            function bind_condition() {
                var data = $('#data').val();
                if (data.length > 0) {
                    try {
                        data = JSON.parse(data);
                        for (let index = 0; index < data.length; index++) {
                            const element = data[index];
                            var id = Math.floor(Math.random() * 10000 + 1);
                            var target = $('#form-item').clone(true);
                            target.attr('id', 'form-item' + id).removeClass('layui-hide');
                            target.find('.layui-input').attr('name', 'tag' + id).val(element.tag);
                            target.find('.condition').attr('name', 'condition' + id).val(element.condition);
                            $('#conditionlist').append(target);
                            form.render('select');
                        }
                        $('#form-item1').remove();
                    } catch (error) {
                        console.error(error);

                    }
                }
            }

            function callback(dsid, data) {
                console.log(dsid);
                console.log(data);


                var obj = [];
                //过滤出参数不为空的内容            
                for (var p in data) {
                    var name = p; //属性名称 
                    var value = data[p]; //属性对应的值 
                    var item = {};
                    if (p.indexOf('tag') > -1) {
                        item.tag = value;
                        obj.push(item);
                    } else {
                        item.condition = value;
                        obj.push(item);
                    }
                }

                var condition_data = [];
                for (let index = 0; index < obj.length; index++) {
                    condition_data.push({
                        'tag': obj[index].tag,
                        'condition': obj[++index].condition
                    });
                }
                var exists = false;
                var idx = 0;
                for (let index = 0; index < searchitem.length; index++) {
                    const element = searchitem[index];
                    if (dsid == element.dsid) {
                        exists = true;
                        idx = index;
                        break;
                    }

                }
                if (exists) {
                    searchitem[idx].data = condition_data;
                } else {
                    searchitem.push({
                        dsid: dsid,
                        data: condition_data
                    });
                }

                console.log(searchitem);
            }

        });
    </script>
</body>

</html>